<?php
require_once 'admin_libs.php';
require '../inc/basics.php';
if (!Core_isAdmin())
	exit;
?>

<script type="text/javascript">
	//$(document).ready(function () {
		
		function tree(){
			$('#pages_menu')
			.jstree({
				'contextmenu': {
					'items': {
						'rename':false,
						'ccp':false,
						'create' : {
							'label'	: "Nieuwe pagina", 
							'icon' : '../javascript/jstree/themes/mediasmurf/page_add.png',
							'visible'	: function (NODE, TREE_OBJ) { 
								if (NODE.length != 1) {
									return 0;
								}
								return TREE_OBJ.check("creatable", NODE); 
							}, 
							'action':pages_add_subpage,
							'separator_after' : true
						},
						'remove' : {
							'label'	: "Verwijder pagina", 
							'icon' : '../javascript/jstree/themes/mediasmurf/page_delete.png',
							'visible'	: function (NODE, TREE_OBJ) { 
								if (NODE.length != 1) {
									return 0;
								}
								return TREE_OBJ.check("deletable", NODE); 
							}, 
							'action':pages_delete,
							'separator_after' : true
						},
						'copy' : {
							'label'	: "Kopieer pagina", 
							'icon' : '../javascript/jstree/themes/mediasmurf/page_copy.png',
							'visible'	: function (NODE, TREE_OBJ) { 
								return true;
							}, 
							'action':pages_copy
						},
						'view' : {
							'label' : "Bekijk pagina",
							'icon' : '../javascript/jstree/themes/mediasmurf/page_white_magnify.png',
							'action':function(node) {
								window.open(
								'/?pageid='+node[0].id.replace(/.*_/,''),
								'_blank'
							);
							}
						}
					}
				},
				"core" : {
					"animation" : 150
				},
				"themes" : {
					"theme" : "mediasmurf",
					"dots" : false,
					"icons" : true
				},
				'dnd': {
					'drag_target': false,
					'drop_target': false
				},
				"json_data" : {
					"ajax" : {
						"url" : "/a/f=adminPageChildnodes",
						"data" : function (n) {
							return { id : n.attr ? n.attr("id") : 0 };
						}
					},
					"progressive_render" : true,
					"progressive_unload" : true
				},
				'plugins': [
					"themes", "json_data", "ui", "crrm", "contextmenu", "dnd"
				]
			})
			.bind('move_node.jstree',function(e, ref){
				var data=ref.args[0];
				var node=data.o[0];
				setTimeout(function(){
					var p=node.parentNode.parentNode;
					var nodes=$(p).find('>ul>li');
					if (p.tagName=='DIV') {
						p=-1;
					}
					var new_order=[];
					for (var i=0;i<nodes.length;++i) {
						new_order.push(nodes[i].id.replace(/.*_/,''));
					}
					$.post('/a/f=adminPageMove', {
						'id':node.id.replace(/.*_/,''),
						'parent_id':(p==-1?0:p.id.replace(/.*_/,'')),
						'order':new_order
					});
				},1);
			})
			.bind("select_node.jstree", function (e, data) { 
				var node=data.args[0].parentNode;
				var ed = tinyMCE.get('body');
				ed.setProgressState(1); // Show progress for TinyMCE
				$.post("/a/f=adminGetPageData", { id: node.id.replace(/.*_/,'')}, function(data){
					$("#alias").val(data.alias);
					ed.setProgressState(0); // Hide progress
					ed.setContent(data.body);

					console.log(data);
				});
			});

			function pages_add_subpage(node, tree){
				var p=node[0].id.replace(/.*_/,'');
				pages_new(p);
			}
			function pages_add_main_page(){
				pages_new(0);
			}
			function pages_new(p){
				//TODO: change action
				$('<form id="newpage_dialog" action="/ww.admin/pages/form.php" method="post" target="page-form-wrapper"><input type="hidden" name="prefill_body_with_title_as_header" value="1" /><input type="hidden" name="action" value="Insert Page Details" /><input type="hidden" name="special[1]" value="1" /><input type="hidden" name="newpage_dialog" value="1" /><input type="hidden" name="parent" value="'+p+'" /><table><tr><th>Name</th><td><input name="name" /></td></tr><tr><th>Page Type</th><td><select name="type"><option value="0">normal</option></select></td></tr><tr><th>Associated Date</th><td><input name="associated_date" id="newpage_date" title="year-month-day hour:minute"/></td></tr></table></form>').dialog({
					modal:true,
					close:function(){
						$(this).closest('div').remove();
						$('#newpage_dialog').remove();
					},
					buttons:{
						'Create Page': function() {
							if ($('#newpage_dialog input[name="name"]').val()=='') {
								return alert('Name must be provided');
							}
							document.getElementById('newpage_dialog').submit();
							$(this).dialog('close');
						},
						'Cancel': function() {
							$(this).dialog('close');
						}
					}
				});
				//$('#newpage_dialog select[name=type]').remoteselectoptions({url:'/a/f=adminPageTypesList'});
				/*
				var date1=new Date();
				$('#newpage_date')
				.datetimepicker({
					dateFormat: 'yy-mm-dd',
					timeFormat: 'hh:mm',
					modal:      true,
					changeMonth:true,
					changeYear: true
				})
				.val(
				date1.getFullYear()+'-'+(date1.getMonth()< 9?'0':'')+(date1.getMonth()+1)
					+'-'+(date1.getDate()<10?'0':'')+date1.getDate()
					+' 00:00'
			);*/
				return false;
			}
			function pages_copy(node, tree) {
				$.post('/a/f=adminPageCopy', {
					'id':node[0].id.replace(/.*_/,'')
				}, function(ret){
					pages_add_node(ret.name, ret.id, ret.pid);
					//TODO: change this
					//document.getElementById('page-form-wrapper')
					//.src="pages/form.php?id="+ret.id;
				}, 'json');
			}
			function pages_delete(node,tree){
				if (!confirm("Are you sure you want to delete this page?")) {
					return;
				}
				$.post('/a/f=adminPageDelete/id='+node[0].id.replace(/.*_/, ''), function(){
					if (node.find('li').length) {
						document.location=document.location.toString();
					}
					else {
						$('#pages_menu').jstree('remove', node);
					}
				});
			}
			function pages_add_node(name,id,pid){
				var pel=null;
				var $jstree=$('#pages_menu');
				if (pid) {
					pel='#page_'+pid;
				}
				else{
					pel='#pages_menu';
				}
				var node=$jstree.jstree(
				'create',
				pel,
				"last",
				{'attr':{'id':'page_'+id},'data':name},
				function(){
					$jstree.jstree('deselect_all');
					$jstree.jstree('select_node','#page_'+id);
				},
				true
			);
			}
		}		//end tree function
		
		$("#tabs").tabs();


		$('textarea.tinymce').tinymce({
			script_url : '../javascript/tiny_mce_3.5.7/tiny_mce.js',
			plugins : "jqueryinlinepopups, codemagic, table, paste, contextmenu",
			dialog_type : "modal",
			width : "100%",
			height:	"400",
			theme : "advanced",
			skin : "mediasmurf",
			theme_advanced_buttons1 : "cut,copy,paste,|,bold,italic,underline,|,bullist,numlist,|,justifyleft,justifycenter,justifyright,formatselect,link,unlink,|,image,charmap,|,codemagic",
			theme_advanced_buttons2 : "",
			theme_advanced_toolbar_align : "left",
			theme_advanced_blockformats : "p,h1,h2,h3",
			theme_advanced_toolbar_location : "top",
			theme_advanced_toolbar_align : "left",
			theme_advanced_path : false,
			language : 'nl',
			paste_auto_cleanup_on_paste : true

		});

		tree();
	
		$("#button_save_content").click(function(){
			alert($("#body").tinymce().getContent());
		});

		$(".drag").draggable({
			helper: function (e,ui) {
			  return $(this).clone().appendTo('body').css('zIndex',5).show();
		  }		
		});
		
$('#page_form').droppable({ 
    drop: function(event, ui) { 
        tinyMCE.activeEditor.execCommand('mceInsertContent', false, ui.draggable.context.outerHTML);
    } 
});


	//}); // end doc ready
</script>


<div class="inner-west" id="pages_menu">
</div>
<div class="inner-center">
	
	<div id="tabs" class="ui-layout-content">
		<ul>
			<li><a href="#tabs-1">Data</a></li>
			<li><a href="#tabs-2">Content</a></li>
			<li><a href="#tabs-3">Layout</a></li>
			<li><a href="#tabs-4">Settings</a></li>
		</ul>
		
		<div id="tabs-1"><div id="page-data"></div></div>
		<div id="tabs-2">
			<form id="page_form"> 
				<label for="alias">Naam</label><input id="alias" name="alias" type="text" value=""></input>
				<label for="body">Inhoud</label><textarea id="body" class="tinymce" name="body"></textarea>
				<button type="button" id="button_save_content">Opslaan</button>
				<button type="button" id="button_preview">Voorbeeld</button>
			</form>
		</div>
		<div id="tabs-3">
		</div>
		<div id="tabs-4">
		</div>
	</div>

</div>
<div class="inner-east">
	<p><strong>Images:</strong><br />
	<img src="images/cms_logo.gif" >
	</p>
	<p><strong>Links:</strong><br />
		<a class="drag" href="#">Linke soep</a>
	</p>
</div>	

